home *** CD-ROM | disk | FTP | other *** search
/ PC World Komputer 2010 April / PCWorld0410.iso / pluginy Firefox / 59338 / 59338.xpi / chrome / global / tree.css < prev    next >
Cascading Style Sheet File  |  2010-01-26  |  15KB  |  500 lines
  1. /* ***** BEGIN LICENSE BLOCK *****
  2.  * Version: MPL 1.1/GPL 2.0/LGPL 2.1
  3.  *
  4.  * The contents of this file are subject to the Mozilla Public License Version
  5.  * 1.1 (the "License"); you may not use this file except in compliance with
  6.  * the License. You may obtain a copy of the License at
  7.  * http://www.mozilla.org/MPL/
  8.  *
  9.  * Software distributed under the License is distributed on an "AS IS" basis,
  10.  * WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
  11.  * for the specific language governing rights and limitations under the
  12.  * License.
  13.  *
  14.  * The Original Code is Mozilla Communicator client code, released
  15.  * March 31, 1998.
  16.  *
  17.  * The Initial Developer of the Original Code is
  18.  * Netscape Communications Corporation.
  19.  * Portions created by the Initial Developer are Copyright (C) 1998-2001
  20.  * the Initial Developer. All Rights Reserved.
  21.  *
  22.  * Contributor(s):
  23.  *   Joe Hewitt (hewitt@netscape.com)
  24.  *
  25.  * Alternatively, the contents of this file may be used under the terms of
  26.  * either the GNU General Public License Version 2 or later (the "GPL"), or
  27.  * the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
  28.  * in which case the provisions of the GPL or the LGPL are applicable instead
  29.  * of those above. If you wish to allow use of your version of this file only
  30.  * under the terms of either the GPL or the LGPL, and not to allow others to
  31.  * use your version of this file under the terms of the MPL, indicate your
  32.  * decision by deleting the provisions above and replace them with the notice
  33.  * and other provisions required by the GPL or the LGPL. If you do not delete
  34.  * the provisions above, a recipient may use your version of this file under
  35.  * the terms of any one of the MPL, the GPL or the LGPL.
  36.  *
  37.  * ***** END LICENSE BLOCK ***** */
  38.  
  39. /* ===== tree.css ===================================================
  40.   == Styles used by the XUL outline element.
  41.   ======================================================================= */
  42.  
  43. @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
  44.  
  45. /* ::::: tree ::::: */
  46.  
  47. tree {
  48.   margin: 5px 4px;
  49.   border: 2px solid !important;
  50. -moz-border-radius: 5px;
  51. -moz-border-top-colors:#969595 #c1c0bf !important;
  52. -moz-border-bottom-colors:#d6d5d4 #e0dfde !important;
  53. -moz-border-left-colors:#bbbab9 #dcdbda !important;
  54. -moz-border-right-colors:#bcbbba #dcdbda !important;
  55.   background-color: #FFFFFF;
  56.   color: #000000;
  57. }
  58.  
  59. tree:focus {
  60. -moz-border-top-colors:#2f75c5 #789bc3 !important;
  61. -moz-border-bottom-colors:#3278c7 #88abd3 !important;
  62. -moz-border-left-colors:#3177c6 #86a8d1 !important;
  63. -moz-border-right-colors:#3278c7 #86a8d1 !important;
  64. }
  65.  
  66. /* ::::: tree focusring ::::: */
  67. /*
  68. .focusring > .tree-stack > .tree-rows > .tree-bodybox {
  69.   border: 1px solid transparent;  
  70. }
  71.  
  72. .focusring:focus > .tree-stack > .tree-rows > .tree-bodybox {
  73.   border: 1px solid #000000;
  74. }*/
  75.  
  76.  
  77. /* ::::: tree rows ::::: */
  78.  
  79. treechildren::-moz-tree-row {
  80.   border: 2px solid transparent;
  81. /*   min-height: 18px; */
  82.   height: 19px;
  83. }
  84.  
  85. treechildren::-moz-tree-row(hover) {
  86. /*background-color:#dae8f6;
  87. background-image: url("chrome://browser/skin/icons/treeitem_hover.png");
  88. background-repeat:repeat-x;*/
  89. background: -moz-linear-gradient(top, #deeefe, #ccdae7);
  90. border: 2px solid !important;
  91. -moz-border-radius: 3px;
  92. -moz-border-top-colors:#cce1f6 #e7f3fe !important;
  93. -moz-border-bottom-colors:#cadef2 #e3eef8 !important;
  94. -moz-border-left-colors:#cbe0f4 #e5f1fb !important;
  95. -moz-border-right-colors:#cadff3 #e5f0fb !important;
  96. }
  97.  
  98. treechildren::-moz-tree-row(selected) {
  99. /*background-color:#4790d7;
  100. background-image: url("chrome://browser/skin/icons/treeitem_sel.png");
  101. background-repeat:repeat-x;*/
  102. background: -moz-linear-gradient(top, #68b4fd, #5190cf);
  103. border: 2px solid !important;
  104. -moz-border-radius: 3px;
  105. -moz-border-top-colors:#418bd4 #89c3fd !important;
  106. -moz-border-bottom-colors:#418bd4 #71a8df !important;
  107. -moz-border-left-colors:#418bd4 #7fb9f1 !important;
  108. -moz-border-right-colors:#418bd4 #7ab3ea !important;
  109. color:#ffffff !important;
  110. }
  111.  
  112. treechildren::-moz-tree-row(selected, focus) {
  113. /*background-color:#4790d7;
  114. background-image: url("chrome://browser/skin/icons/treeitem_sel.png");
  115. background-repeat:repeat-x;*/
  116. background: -moz-linear-gradient(top, #68b4fd, #5190cf);
  117. border: 2px solid !important;
  118. -moz-border-radius: 3px;
  119. -moz-border-top-colors:#418bd4 #89c3fd !important;
  120. -moz-border-bottom-colors:#418bd4 #71a8df !important;
  121. -moz-border-left-colors:#418bd4 #7fb9f1 !important;
  122. -moz-border-right-colors:#418bd4 #7ab3ea !important;
  123. color:#ffffff !important;
  124. }
  125.  
  126. treechildren::-moz-tree-row(current, focus) {
  127. /*background-color:#dae8f6;
  128. background-image: url("chrome://browser/skin/icons/treeitem_hover.png");
  129. background-repeat:repeat-x;*/
  130. background: -moz-linear-gradient(top, #deeefe, #ccdae7);
  131. border: 2px solid !important;
  132. -moz-border-radius: 3px;
  133. -moz-border-top-colors:#cce1f6 #e7f3fe !important;
  134. -moz-border-bottom-colors:#cadef2 #e3eef8 !important;
  135. -moz-border-left-colors:#cbe0f4 #e5f1fb !important;
  136. -moz-border-right-colors:#cadff3 #e5f0fb !important;
  137. }
  138.  
  139. treechildren::-moz-tree-row(selected, current, focus) {
  140. /*background-color:#4790d7;
  141. background-image: url("chrome://browser/skin/icons/treeitem_sel.png");
  142. background-repeat:repeat-x;*/
  143. background: -moz-linear-gradient(top, #68b4fd, #5190cf);
  144. border: 2px solid !important;
  145. -moz-border-radius: 3px;
  146. -moz-border-top-colors:#418bd4 #89c3fd !important;
  147. -moz-border-bottom-colors:#418bd4 #71a8df !important;
  148. -moz-border-left-colors:#418bd4 #7fb9f1 !important;
  149. -moz-border-right-colors:#418bd4 #7ab3ea !important;
  150. }
  151.  
  152. tree[seltype="cell"] > treechildren::-moz-tree-row,
  153. tree[seltype="text"] > treechildren::-moz-tree-row {
  154. border: none;
  155. background-color: transparent;
  156. text-decoration:none !important;
  157. }
  158.  
  159. /* ::::: tree cells ::::: */
  160.  
  161. treechildren::-moz-tree-cell {
  162. padding: 0px 2px 0px 2px;
  163. }
  164.  
  165. tree[seltype="cell"] > treechildren::-moz-tree-cell-text,
  166. tree[seltype="text"] > treechildren::-moz-tree-cell-text,
  167. treechildren::-moz-tree-cell-text {
  168. color: inherit;
  169. text-decoration:none !important;
  170. }
  171.  
  172. treechildren::-moz-tree-cell-text(selected) {
  173. color: #ffffff;
  174. text-decoration:none !important;
  175. }
  176.  
  177. tree[seltype="cell"] > treechildren::-moz-tree-cell {
  178. border: 1px solid transparent;
  179. padding: 0px 1px 0px 1px;
  180. }
  181.  
  182. tree[seltype="text"] > treechildren::-moz-tree-cell-text {
  183. border: 1px solid transparent;
  184. padding: 0px 1px 1px 1px;
  185. text-decoration:none !important;
  186. }
  187.  
  188. tree[seltype="cell"] > treechildren::-moz-tree-cell(active, selected) {
  189. background-color: -moz-cellhighlight;
  190. }
  191. tree[seltype="cell"] > treechildren::-moz-tree-cell-text(active, selected) {
  192. color:#ffffff !important;
  193. }
  194.  
  195. tree[seltype="text"] > treechildren::-moz-tree-cell-text(active, selected) {
  196. background-color: -moz-cellhighlight;
  197. color:#ffffff !important;
  198. }
  199.  
  200. treechildren::-moz-tree-cell-text(selected, focus) {
  201. color:#ffffff !important;
  202. }
  203.  
  204. tree[seltype="cell"] > treechildren::-moz-tree-cell(active, selected, focus) {
  205. background-color: Highlight;
  206. }
  207.  
  208. tree[seltype="text"] > treechildren::-moz-tree-cell-text(active, selected, focus) {
  209. background-color: Highlight;
  210. color:#ffffff !important;
  211. }
  212.  
  213. tree[seltype="cell"] > treechildren::-moz-tree-cell-text(active, selected, focus) {
  214. color:#ffffff !important;
  215. }
  216.  
  217. tree[seltype="text"] > treechildren::-moz-tree-cell-text(active, selected, focus) {
  218. color:#ffffff !important;
  219. }
  220.  
  221. tree[seltype="cell"] > treechildren::-moz-tree-cell(active, current, focus) {
  222. border: 1px dotted #000000;
  223. }
  224.  
  225. tree[seltype="cell"] > treechildren::-moz-tree-cell(selected, current, focus) {
  226. color:#ffffff !important;
  227. }
  228.  
  229. tree[seltype="text"] > treechildren::-moz-tree-cell-text(active, current, focus) {
  230. border: 1px dotted #000000;
  231. }
  232.  
  233. tree[seltype="cell"] > treechildren::-moz-tree-cell(active, selected, current, focus) {
  234. border: 1px dotted #C0C0C0;
  235. }
  236.  
  237. tree[seltype="text"] > treechildren::-moz-tree-cell-text(active, selected, current, focus) {
  238. border: 1px dotted #C0C0C0;
  239. }
  240.  
  241. /* ::::: lines connecting cells ::::: */
  242.  
  243. tree[seltype="cell"] > treechildren::-moz-tree-line,
  244. tree[seltype="text"] > treechildren::-moz-tree-line,
  245. treechildren::-moz-tree-line {
  246. border: 1px dotted ThreeDShadow;
  247. }
  248.  
  249. tree[seltype="cell"] > treechildren::-moz-tree-line(active, selected, focus),
  250. treechildren::-moz-tree-line(selected, focus) {
  251. border: 1px dotted HighlightText;
  252. }
  253.  
  254. /* ::::: tree separator ::::: */
  255.  
  256. treechildren::-moz-tree-separator {
  257. border-top: 1px solid ThreeDShadow;
  258. border-bottom: 1px solid ThreeDHighlight;
  259. }
  260.  
  261.  
  262. /* ::::: drop feedback ::::: */
  263.  
  264. tree[seltype="cell"] > treechildren::-moz-tree-cell-text(primary, dropOn),
  265. tree[seltype="text"] > treechildren::-moz-tree-cell-text(primary, dropOn),
  266. treechildren::-moz-tree-cell-text(primary, dropOn) {
  267. background-color: Highlight;
  268. color: HighlightText;
  269. }
  270.  
  271. treechildren::-moz-tree-drop-feedback {
  272. background-color: Highlight;
  273. width: 50px;
  274. height: 2px;
  275. -moz-margin-start: 5px;
  276. }
  277.  
  278. /* ::::: tree progress meter ::::: */
  279.  
  280. treechildren::-moz-tree-progressmeter {
  281. margin: 2px 4px;
  282. border: 2px solid;
  283. -moz-border-top-colors: ThreeDShadow -moz-Dialog;
  284. -moz-border-right-colors: ThreeDHighlight -moz-Dialog;
  285. -moz-border-bottom-colors: ThreeDHighlight -moz-Dialog;
  286. -moz-border-left-colors: ThreeDShadow -moz-Dialog;
  287. background-color: -moz-Dialog;
  288. color: ThreeDShadow;
  289. }
  290.  
  291. treechildren::-moz-tree-progressmeter(progressUndetermined) {
  292. list-style-image: url("chrome://global/skin/progressmeter/progressmeter-busy.gif");
  293. }
  294.  
  295. treechildren::-moz-tree-cell-text(progressmeter) {
  296. margin: 2px 4px;
  297. }
  298.  
  299. /* ::::: tree columns ::::: */
  300.  
  301. treecol,
  302. treecolpicker {
  303. -moz-appearance: none;
  304. -moz-box-align: center;
  305. -moz-box-pack: center;
  306. border: 2px solid;
  307. -moz-border-top-colors: transparent transparent;
  308. -moz-border-right-colors:transparent transparent;
  309. -moz-border-bottom-colors: #bdbbb8 #ffffff;
  310. -moz-border-left-colors: transparent transparent;
  311. background: #E8E7E6 url("chrome://browser/skin/icons/gripper.png") no-repeat center right !important;
  312. color: #000000;
  313. padding: 0px 4px;
  314. }
  315.  
  316. .treecol-image {
  317. padding: 0px 1px;
  318. }
  319.  
  320. .treecol-text {
  321. margin: 0px !important;
  322. }
  323.  
  324. treecol[hideheader="true"] {
  325. -moz-appearance: none;
  326. border: none;
  327. padding: 0;
  328. }
  329.  
  330. /* ..... internal box ..... */
  331.  
  332. treecol:hover:active,
  333. treecolpicker:hover:active {
  334. border-top: 2px solid;
  335. border-right: 1px solid;
  336. border-bottom: 1px solid;
  337. border-left: 2px solid;
  338. -moz-border-top-colors: ThreeDShadow -moz-Dialog;
  339. -moz-border-right-colors: ThreeDShadow;
  340. -moz-border-bottom-colors: ThreeDShadow;
  341. -moz-border-left-colors: ThreeDShadow -moz-Dialog;
  342. padding-top: 1px;
  343. padding-bottom: 0px;
  344. -moz-padding-start: 5px;
  345. -moz-padding-end: 4px;
  346. }
  347.  
  348. .treecol-image:hover:active {
  349. padding-top: 1px;
  350. padding-bottom: 0px;
  351. -moz-padding-start: 2px;
  352. -moz-padding-end: 1px;
  353. }
  354.  
  355. /* ::::: column drag and drop styles ::::: */
  356.  
  357. treecol[dragging="true"] {
  358. background-color: #DEDDDC !important;
  359. color: ThreeDHighlight !important;
  360. }
  361.  
  362. treecol[insertafter="true"] {
  363. -moz-border-right-colors: ThreeDDarkShadow ThreeDShadow;
  364. }
  365.  
  366. treecol[insertbefore="true"] {
  367. -moz-border-left-colors: ThreeDDarkShadow ThreeDShadow;
  368. }
  369.  
  370. treechildren::-moz-tree-column(insertbefore) {
  371. border-left: 1px solid ThreeDShadow;
  372. }
  373.  
  374. treechildren::-moz-tree-column(insertafter) {
  375. border-right: 1px solid ThreeDShadow;
  376. }
  377.  
  378. /* ::::: sort direction indicator :::::  */
  379.  
  380. .treecol-sortdirection {
  381. list-style-image: none;
  382. }
  383.  
  384. treecol:not([hideheader="true"]) > .treecol-sortdirection[sortDirection="ascending"] {
  385. list-style-image: url("chrome://global/skin/tree/sort-asc.png");
  386. }
  387.  
  388. treecol:not([hideheader="true"]) > .treecol-sortdirection[sortDirection="ascending"]:-moz-system-metric(windows-classic) {
  389. list-style-image: url("chrome://global/skin/tree/sort-asc-classic.png");
  390. }
  391.  
  392. treecol:not([hideheader="true"]) > .treecol-sortdirection[sortDirection="descending"] {
  393. list-style-image: url("chrome://global/skin/tree/sort-dsc.png");
  394. }
  395.  
  396. treecol:not([hideheader="true"]) > .treecol-sortdirection[sortDirection="descending"]:-moz-system-metric(windows-classic) {
  397. list-style-image: url("chrome://global/skin/tree/sort-dsc-classic.png");
  398. }
  399.  
  400. /* ::::: column picker :::::  */
  401.  
  402. .tree-columnpicker-icon {
  403. list-style-image: url("chrome://global/skin/tree/columnpicker.png");
  404. }
  405.  
  406. /* ::::: twisty :::::  */
  407.  
  408. treechildren::-moz-tree-twisty {
  409. -moz-padding-end: 4px;
  410. padding-top: 1px;
  411. width: 13px; /* The image's width is 9 pixels */
  412. list-style-image: url("chrome://global/skin/tree/twisty-clsd.png");
  413. }
  414.  
  415. treechildren::-moz-tree-twisty(open) {
  416. width: 13px; /* The image's width is 9 pixels */
  417. list-style-image: url("chrome://global/skin/tree/twisty-open.png");
  418. }
  419.  
  420. treechildren::-moz-tree-indentation {
  421. width: 18px;
  422. }
  423.  
  424. /* ::::: gridline style ::::: */
  425.  
  426. treechildren.gridlines::-moz-tree-cell {
  427. border-right: 1px solid transparent !important;
  428. border-bottom: 1px solid transparent !important;
  429. }
  430.  
  431. treechildren.gridlines::-moz-tree-row {
  432. border: none;
  433. }
  434.  
  435. /* ::::: editable tree ::::: */
  436.  
  437. treechildren::-moz-tree-row(selected, editing) {
  438. background-color: transparent;
  439. border: none;
  440. }
  441.  
  442. treechildren::-moz-tree-cell-text(selected, editing) {
  443. color: inherit;
  444. }
  445.  
  446. .tree-input {
  447. -moz-appearance: none;
  448. border: 1px solid Highlight;
  449. -moz-border-top-colors: Highlight;
  450. -moz-border-bottom-colors: Highlight;
  451. -moz-border-left-colors: Highlight;
  452. -moz-border-right-colors: Highlight;
  453. margin: 0;
  454. -moz-margin-start: -4px;
  455. padding: 1px;
  456. }
  457.  
  458. /* ::::: twisty :::::  */
  459.  
  460. treechildren::-moz-tree-indentation {
  461. width: 12px;
  462. }
  463.  
  464. treechildren::-moz-tree-twisty {
  465. -moz-padding-end: 1px;
  466. width: 13px;
  467. }
  468.  
  469. /*
  470.   Please note that the following RTL icons are only available in Aero themes:
  471.    * chrome://global/skin/tree/twisty-clsd-hover.png
  472.    * chrome://global/skin/tree/twisty-open-hover.png
  473.    * chrome://global/skin/tree/twisty-clsd-rtl.png
  474.    * chrome://global/skin/tree/twisty-open-rtl.png
  475.    * chrome://global/skin/tree/twisty-clsd-hover-rtl.png
  476.    * chrome://global/skin/tree/twisty-open-hover-rtl.png
  477. */
  478. treechildren::-moz-tree-twisty(hover) {
  479. list-style-image: url("chrome://global/skin/tree/twisty-clsd.png");
  480. }
  481.  
  482. treechildren::-moz-tree-twisty(hover, open) {
  483. list-style-image: url("chrome://global/skin/tree/twisty-open.png");
  484. }
  485.  
  486. tree[chromedir="rtl"] > treechildren::-moz-tree-twisty {
  487. list-style-image: url("chrome://global/skin/tree/twisty-clsd-rtl.png");
  488. }
  489.  
  490. tree[chromedir="rtl"] > treechildren::-moz-tree-twisty(open) {
  491. list-style-image: url("chrome://global/skin/tree/twisty-open-rtl.png");
  492. }
  493.  
  494. tree[chromedir="rtl"] > treechildren::-moz-tree-twisty(hover) {
  495. list-style-image: url("chrome://global/skin/tree/twisty-clsd-rtl.png");
  496. }
  497.  
  498. tree[chromedir="rtl"] > treechildren::-moz-tree-twisty(hover, open) {
  499. list-style-image: url("chrome://global/skin/tree/twisty-open-rtl.png");
  500. }